<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head th:replace="fragments/common :: head" />
<body>
    <div th:replace="fragments/common :: jQuery" />
    <div class="portletBody">
        <div id="menu" th:include="fragments/menus :: main (index)" />
        <div class="page-header">
            <h1 th:text="#{view_student}"></h1>
        </div>
        <div>
            <form action="#" th:action="@{/student_view_result/{gradebookId}(gradebookId = ${gradebookId})}" method="get" id="student-view-form">
                <label th:text="#{choose_username}"></label>
                <select id="selectedParticipant" onchange="showStudent();">
                    <option th:each="category : ${studentMap}" th:value="${category.value}" th:selected="${category.value eq lastSelected}" th:text="${category.key}">
                </select>
            </form>
        </div>
        <br/>
        <div id="select_participant" th:if="${selStudent == null}">
            <span th:text="#{select_participant}"></span>
        </div>

        <table th:if="${selStudent != null}" class="table-condensed">
            <tr>
                <th>Student</th>
                <td></td>
                <td th:text="${selStudent.username}"></td>
            </tr>
            <tr th:each="heading, iterStats : ${selStudent.gradebook.headings}">
                <span th:if="!${iterStats.first}">
                    <th th:text=" ${heading}"></th>
                    <td></td>
                    <td th:text="${selStudent.grades[iterStats.index-1]}"></td>
                </span>
            </tr>
       </table>
       <div class="act">
           <form action="#" th:action="@{/}" method="get">
               <input accesskey="x" type="submit" id="gradebook-cancel-button" th:value="#{back}">
           </form>
        </div>
    </div>
</body>
</html>
